<!DOCTYPE html>
<html lang="en">
 <head>
  <meta charset="UTF-8" />
  <meta name="author-name" content="Mironcoder | Miron Mahmud" />
  <meta name="author-email" content="mironcoder@gmail.com" />
  <meta name="author-profile" content="https://themeforest.net/user/mironcoder" />
  <meta name="template-name" content="Vegana" />
  <meta name="template-created" content="09-November-2020" />
  <meta name="template-title" content="Vegana - vegan food eCommerce store html template" />
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
  <meta name="keywords" content="vegana, vegan, food, eCommerce, store, html, template, bootstrap, vegetarian, organic, vegetables, greengrocery, fruit, healthy, shop" />
  <title>登录</title>
  <link rel="icon" href="../assets/images/logo/favicon.png" />
  <link rel="stylesheet" href="../assets/source/css/vendor/flaticon.css" />
  <link rel="stylesheet" href="../assets/source/css/vendor/fontawesome.css" />
  <link rel="stylesheet" href="../assets/source/css/vendor/bootstrap.min.css" />
  <link rel="stylesheet" href="../assets/source/css/custom/main.css" />
  <link rel="stylesheet" href="../assets/source/css/custom/signin-up.css" />
 </head>
 <body>
  <div id="app"> 
  <section class="sign-part">
   <div class="sign-content">
    <div class="content-cover"> 
     <a href="#"><img src="../assets/images/logo/01.png" alt="logo" /></a>
     <h1>全球最大的在线纯素食品电子商务商店。</h1>
    </div>
   </div>
   <div class="sign-form">
    <div class="back-arrow"> 
     <a href="#"><img src="../assets/images/logo/01.png" alt="logo" /></a> 
     <a href="../home-1.html"><i class="fas fa-arrow-left"></i></a>
    </div>
    <div class="sign-cate">
    </div>
    <div class="tab-pane active" id="signin">
     <div class="sign-heading">
      <h2>登录</h2>
      <p>使用凭据访问您的帐户。</p>
     </div>
     <div class="form"> 
      <label class="form-label"> <input type="text" v-model="user" placeholder="用户名/电话号码/电子邮箱" /> </label> 
      <label class="form-label"> <input type="password" id="pass" v-model="pwd" placeholder="密码" /> </label> 
      <label class="form-link">
       <div class="custom-control custom-checkbox"> 
        <input type="checkbox" class="custom-control-input" id="signin-check" /> 
        <label class="custom-control-label" for="signin-check">记住密码</label>
       </div> <a href="#">忘记密码？</a> </label> 
      <label class="form-btn"> <button type="submit" @click="login" class="btn btn-outline">立即登录</button> </label>
     </div>
     <div class="form-bottom">
      <p>没有帐户？单击<a href="reg.html">( 注册 )</a> 按钮上方的按钮。</p>
     </div>
    </div>
  </section>
  </div> 
  <script src="../js/vue.js"></script>
  <script src="../assets/source/js/vendor/jquery-1.12.4.min.js"></script> 
  <script src="../assets/source/js/vendor/popper.min.js"></script> 
  <script src="../assets/source/js/vendor/bootstrap.min.js"></script> 
  <script src="../assets/source/js/custom/main.js"></script> 
  <script src="../js/axios.js"></script>
  <script src="../js/qs.js"></script>
  <script>
     let app = new Vue({
        el:'#app',
        data:{
            user:'',
            pwd:''
        },
        methods:{
            login(){
              axios.post("../userController/login",qs.stringify({
                  user:this.user,
                  pwd:this.pwd
              })).then(resp=>{
                  console.log(resp);
                  if(resp.data != -1){
                    if(resp.data.status == 1){
                    location.href="../back/index.html";
                    }else if(resp.data.status == 0){
                    location.href="../index.html";
                    localStorage.setItem("username",resp.data.uname);
                    localStorage.setItem("uid",resp.data.uid);
                    }
                  }else{
                    alert("登录密码错误");
                    return;
                  }
              });
            }
        }
    });
  </script>
 </body>
</html>